<div class="row list-row">
  <!---托管行列表Begin-->
  <div class="col-sm-3">
    <div class="box box-success">
      <div class="box-header with-border">
        <h3 class="box-title">
          托管行
        </h3>
      </div>
      <div class="box box-body table-responsive no-padding">
        <form class="form-inline">
          <div class="form-group">
            <input type="text" class="form-control ibt-search-input" id="shortName"
                   #shortName placeholder="请输入托管行名称"
                   (keyup.enter)="bankLocalSearch(shortName.value)">
            <button type="button" class="btn btn-primary"
                    (click)="bankLocalSearch(shortName.value)">
              查询
            </button>
          </div>
        </form>
        <div style="max-height: 485px;overflow: auto;">
          <table class="table table-bordered table-hover table-striped">
            <thead>
            <tr>
              <th>序号</th>
              <th>托管行</th>
            </tr>
            </thead>
            <tbody>
            <tr *ngFor="let item of bankListFilteredData; let i = index">
              <td>
                {{i+1}}
              </td>
              <td>
                <a href="javascript:void(0)"
                   (click)="userSearchFundName = '';getFundsConfigListDataByBankId(item.bankId, item.shortName, userSearchFundName,item.toSendTradeOrder, item.paymentMethod, item.note)">
                  {{item.shortName}}
                </a>
              </td>
            </tr>
            </tbody>
          </table>
        </div>
      </div>
    </div>
  </div>
  <!---托管行列表End-->
  <div class="col-sm-9">
    <div class="box box-primary">
      <div class="box-header with-border">
        <h3 class="box-title">
          银行间支付参数配置
          <span><em><small>{{configViewStatus.detail ? "详细配置":"全局配置"}}</small></em></span>
        </h3>
        <button type="button" class="btn btn-primary" (click)="switch2Detail()">详细配置</button>
        <button type="button" class="btn btn-primary" (click)="switch2Global()">全局配置</button>
        <a class="btn btn-default pull-right fa fa-arrow-left" routerLink="../" alt="返回" title="返回"></a>
      </div>
      <div class="box box-body table-responsive no-padding">
        <form class="form-inline">
          <h4 class="box-title">
            当前托管行：
            <span class="text-green"><strong>{{activedBankName}}</strong></span>
          </h4>
        </form>
        <!--基金配置搜索栏区域Begin-->
        <form class="form-inline" [hidden]="!configViewStatus.detail">
          <div>
            <div class="form-group">
              <label for="userSearchFundName">基金名称：</label>
              <input type="text" class="form-control ibt-search-input" id="userSearchFundName" name="userSearchFundName"
                     [(ngModel)]="userSearchFundName">
            </div>
            <div class="form-group search-btn-container max">
              <button type="button" class="btn btn-primary" (click)="fundSearch()">查询</button>
              <button type="button" class="btn btn-warning" (click)="resetFundSearch()">重置</button>
            </div>
          </div>
        </form>
        <!--基金配置搜索栏区域End-->
        <!--基金详细配置列表Begin-->
        <table class="table table-bordered table-hover table-striped" [hidden]="!configViewStatus.detail">
          <thead>
          <tr>
            <th>序号</th>
            <th>基金名称</th>
            <th>基金代码</th>
            <th>是否发送成交单</th>
            <th>划款方式</th>
            <th>备注</th>
            <th>操作</th>
          </tr>
          </thead>
          <tbody>
          <tr *ngFor="let item of fundListData;let i = index;" [attr.data-index]="i">
            <td>
              {{item.__FE_SORT_ID__}}
            </td>
            <td>
              {{item.fundName}}
            </td>
            <td>
              {{item.fundCode}}
            </td>
            <td>
              {{item.toSendTradeOrder === 'Y' ? '是': (item.toSendTradeOrder === 'N' ? '否': '')}}
            </td>
            <td>
              {{item.paymentMethod === 'ELECTRONICS' ? '电子': (item.paymentMethod === 'FAX' ? '传真':'')}}
            </td>
            <td>
              {{item.note}}
            </td>
            <td>
              <div class="cell">
                <button type="button" class="btn btn-primary"
                        (click)="toggleFundConfigModalOpen(item.fundName, item.fundCode, item.toSendTradeOrder, item.paymentMethod, item.note)">
                  修改
                </button>
                <button type="button" class="btn btn-warning"
                        (click)="deleteFundConfigConfirm(activedBankId, item.fundCode, item.fundName)">
                  重置
                </button>
              </div>
            </td>
          </tr>
          </tbody>
        </table>
        <!--基金详细配置列表End-->

        <!--基金详细配置列表分页Begin-->
        <div class="box-footer clearfix" [hidden]="!configViewStatus.detail">
          <app-pagination
            [currentPageNum]="pageInfo.currentPageNum"
            [pagesShow]="pageInfo.pagesShow"
            [totalPages]="pageInfo.totalPages"
            (pageChanged)="pageNavigation($event)">
            <div class="pull-left pagination-detail" data-pagination-additional="true">
            <span class="pagination-info">
              当前显示第{{pageInfo.startRow}}到第{{pageInfo.endRow}}条&nbsp;&nbsp;&nbsp;&nbsp;总共{{pageInfo.total}}条
            </span>
              <span class="page-list"><span class="btn-group dropup">
              <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                <span class="page-size">{{pageInfo.pageSize}}</span>
                <span class="caret"></span>
              </button>
              <ul class="dropdown-menu" role="menu">
                <li *ngFor="let i of pageInfo.pageList" role="menuitem"
                    [class.active]="pageInfo.pageSize === i"
                    (click)="pageSizeChange(i)">
                  <a href="javascript:void(0)">{{i}}</a>
                </li>
                </ul>
            </span> 条记录每一页</span>
            </div>
          </app-pagination>
        </div>
        <!--基金详细配置列表分页End-->

        <!--基金全局配置视图Begin-->
        <form class="form-inline" [hidden]="!configViewStatus.global">
          <div>
            <div class="form-group">
              <label for="toSendTradeOrder">是否发送成交单：</label>
              <select class="form-control ibt-search-input" name="toSendTradeOrder" id="toSendTradeOrder"
                      [(ngModel)]="activedBankToSendTradeOrder">
                <option value="N">否</option>
                <option value="Y">是</option>
              </select>
            </div>
            <div class="form-group">
              <label for="paymentMethod">划款方式：</label>
              <select class="form-control ibt-search-input" name="paymentMethod" id="paymentMethod"
                      [(ngModel)]="activedBankPaymentMethod">
                <option value="ELECTRONICS">电子</option>
                <option value="FAX">传真</option>
              </select>
            </div>
            <div class="form-group block">
              <label for="note">备注:</label>
              <textarea class="form-control ibt-search-input" name="note" id="note"
                        rows="4" cols="35"
                        [(ngModel)]="activedBankNote"></textarea>
            </div>
            <div class="form-group search-btn-container max">
              <button type="button" class="btn btn-success" (click)="updateBankGlobalConfig()">保存</button>
            </div>
          </div>
        </form>
        <!--基金全局配置视图End-->
      </div>
    </div>
  </div>
</div>

<!--基金修改配置模态框Begin--->
<div #fundConfigModal class="modal fade" id="fundConfigModal" data-backdrop="static"
     data-keyboard="false">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" aria-label="Close" (click)="toggleFundConfigModalClose()">
          <span aria-hidden="true">×</span></button>
        <h4 class="modal-title">基金配置</h4>
      </div>
      <div class="modal-body">
        <form class="form-inline" novalidate>
          <h5 class="box-title">
            <span>托管行：<em><small class="text-green">{{activedBankName}}</small></em></span>
            <span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
            <span>基金名称：<em><small class="text-orange">{{modalData.fundName}}</small></em></span>
            <span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
            <span>基金代码：<em><small class="text-blue">{{modalData.fundCode}}</small></em></span>
          </h5>
        </form>
        <form class="form-inline" novalidate>
          <div class="form-group">
            <label for="modal-toSendTradeOrder" class="control-label">发送成交单：</label>
            <select name="modal-toSendTradeOrder" id="modal-toSendTradeOrder" class="form-control"
                    [(ngModel)]="modalData.toSendTradeOrder">
              <option value="Y">是</option>
              <option value="N">否</option>
            </select>
          </div>
          <div class="form-group">
            <label for="modal-paymentMethod" class="control-label">划款方式：</label>
            <select name="modal-paymentMethod" id="modal-paymentMethod" class="form-control"
                    [(ngModel)]="modalData.paymentMethod">
              <option value="ELECTRONICS">电子</option>
              <option value="FAX">传真</option>
            </select>
          </div>
          <div class="form-group block sm-margin-top">
            <label for="modal-note" class="control-label">备注：</label>
            <textarea type="text" name="modal-note" id="modal-note" class="form-control"
                      rows="4" cols="35"
                      [(ngModel)]="modalData.note"></textarea>
          </div>
        </form>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" (click)="toggleFundConfigModalClose()">否</button>
        <button type="button" class="btn btn-primary" (click)="updateFundConfig()">是</button>
      </div>
    </div>
  </div>
</div>
<!--基金修改配置模态框Begin--->


